var users = new Array();//存放所有用户的数据
var operateType; //按钮的操作类型

//创建用户的构造方法
function user(code,userName,sex,passWord,age,birthday) {
    this.code = code;
    this.userName = userName;
    this.sex = sex;
    this.passWord = passWord;
    this.age = age;
    this.birthday = birthday;
}

//初始化数据
function init() {
    users[0] = new user("1001","张三","女","1234","29","1991-1-1");
    users[1] = new user("1002","李四","男","1234","28","1992-2-2");
    users[2] = new user("1003","王五","女","1234","27","1993-3-3");
    users[3] = new user("1004","李六","女","1234","26","1994-4-4");

    refresh(users);//保证表格中的数据是最新的
}

//刷新表格
function refresh(users) {
    var tbody = document.getElementById("tbody");
    var html ="";
    var color="warning";
    var flag = true;
    for(var i in users) {
        if(flag){
            color="info";
        } else{
            color="warning";
        }
        html = html + "<tr class='" + color + "'><td style='width:30px;'><input type='checkbox'></td><td id='code'>"
            + users[i].code + "</td><td id='userName'>"
            + users[i].userName + "</td><td id='sex'>"
            + users[i].sex + "</td><td id='passWord'>"
            + users[i].passWord + "</td><td id='age'>"
            + users[i].age + "</td><td id='birthday'>"
            + users[i].birthday + "</td>"
            + "</tr>";
        flag = !flag;//颜色转换
    }
    tbody.innerHTML = html;//在表格中创建所有tr元素
}

//当点击添加按钮
$("#user_add").on("click",function(){
    operateType = "add";
});

//当点击编辑按钮
$("#user_edit").on("click",function(){
    operateType = "edit";
})

//保存按钮
$("#save").on("click",function(){
    //新增用户
    if(operateType=="add"){
        var newUser = new user($("#m_code").val(),$("#m_userName").val(),$("#m_sex").val(),
        $("#m_passWord").val(),$("#m_age").val(),$("#m_birthday").val());
        users = users.concat(newUser);//在原数组中添加一个新的用户元素；
        //编辑用户
    } else if(operateType == "edit") {
        for(var i = 0;i<users.length;i++) {
            if(code == users[i].code) {// 如果选中的用户编号 和 数组中某个用户的编号 相同 ，这个用户就是要修改的用户
                users[i].code = $("#m_code").val();
                users[i].userName = $("#m_userName").val();
                users[i].sex = $("#m_sex").val();
                users[i].passWord = $("#m_passWord").val();
                users[i].age = $("#m_age").val();
                users[i].birthday = $("#m_birthday").val();
            }
        }
        alert("修改成功")
    }
    refresh(users);//保证表格中的数据是最新的
});

//删除用户
$("#user_delete").on("click",function(){
    var checkboxs = $("input[type='checkbox']");//获取所有复选框
    let f = false;//是否选中用户的标记
    for(var i = 0;i< checkboxs.length;i++) {
        var box = checkboxs[i];
        if(box.checked){//如果复选框被选中
            f = true;
            box = $(box);//将jsdom对象转换为jquery对象
            let code = box.parent().siblings("#code").text();// 复选框父级的兄弟#code元素
            for(var i =0;i<users.length;i++){
                if(code==users[i].code){
                    users.splice(i,1);// 删除1个数组中下标为i的元素
                    alert("删除成功");
                } 
            }
        }
    }
    if(!f) {
        alert("请选择一个用户");
    }
    refresh(users);//保证用户表中的数据是最新数据
});

//编辑用户
var code;//被修改的用户id
$("#user_edit").on("click",function(){
    var checkboxs = $("input[type='checkbox']");// 获取所有复选框
    let f = false;//复选框的状态确认
    for(var i = 0;i<checkboxs.length;i++) {
        var box = checkboxs[i];
        if(box.checked){
            f = true;
            $(this).attr("data-toggle","modal");
            $(this).attr("data-target","#myModal");
            box = $(box);//将jsdom对象转换为jquery对象
            code = box.parent().siblings("#code").text();
            // 获取表格中选中用户的各项数据
            var userName = box.parent().siblings("#userName").text();
            var sex = box.parent().siblings("#sex").text();
            var passWord = box.parent().siblings("#passWord").text();
            var age = box.parent().siblings("#age").text();
            var birthday = box.parent().siblings("#birthday").text();
            // 选中用户的各项数据，放在模态框的相应input框中
            $("#m_code").val(code);
            $("#m_userName").val(userName);
            $("#m_sex").val(sex);
            $("#m_passWord").val(passWord);
            $("#m_age").val(age);
            $("#m_birthday").val(birthday);
        }
    }
    if(!f){
        alert("请选择一个用户");
        $(this).attr("data-toggle",null);// 禁用模态框
        $(this).attr("data-target",null);// 禁用模态框
    }
});

//查询用户
$("#user_find").on("click",function(){
    newusers = new Array();//创建一个新数组，来保持原数组不变
    var codeLike = $(this).siblings("#s_code").val();
    var codeName = $(this).siblings("#s_name").val();
    for(var i = 0;i<users.length;i++) {
        if(users[i].code == codeLike || users[i].userName == codeName) {//如果查询到的工号和姓名存在则将其放入新数组
            newusers = newusers.concat(users[i]);
        }
    } 
    refresh(newusers);
});